<template>
  <div>
    <el-button @click="getPerson">获取vuex中的数据</el-button>
    <el-button @click="getPerson2">获取vuex中的数据-计算属性</el-button>
    <!--        $store.state.person-->
    <!--        $store.mutations.updatePerson()-->
    <el-button @click="$store.commit('updatePerson')"
      >更改vuex中的person</el-button
    >
    <el-button @click="$store.commit('updateProfessionTypes', some)"
      >更改vuex中的professionType</el-button
    >
    <div>
      用户名： <el-input v-model="person.name"></el-input> 年龄：<el-input
        v-model="person.age"
      ></el-input>
      <el-button @click="$store.commit('updatePerson', person)"
        >提交到vuex</el-button
      >
      <el-button @click="updatePerson(person)"
        >mapMutations提交到vuex</el-button
      >
    </div>

    <div>
      <!--        $store.state.person-->
      <!--            $store.actions.getProfessionTypes()-->
      <el-button @click="$store.dispatch('getProfessionTypes')"
        >异步请求获取professionTypes</el-button
      >
    </div>
  </div>
</template>

<script>
  import {mapState,mapMutations,mapActions} from 'vuex'
// import New from './components/New.vue';
export default {

  name: "AnyOne",
  components: {
    // New,Old,
  },
  props: {
    sampleP: {
      type: Number,
      default: 0
    }
  },
  data() {
    return {
      sampleD: "value",
      some:[2,4,6],
      person:{
        name:"",
        age:0,
      }
    };
  },
  computed: {
     ...mapState(['person', 'professionTypes'])
    // sampleC() {
    //     return this.sampleD+'--';
    // }
  },
  created() {
  },
  mounted() {
  },
  methods: {
    sampleM() {

    },
    getPerson(){
      // let k =  this.$store.state.person.username;
      let k =  this.$store.state.person;
      this.$message.success(JSON.stringify(k))
    },
    getPerson2(){
      // let k =  this.$store.state.person.username;

      this.$message.success(JSON.stringify(this.person))
    },
    ...mapMutations(['updatePerson']),
      ...mapActions(['getProfessionTypes'])
  },
  watch: {
    // sampleC(newValue, oldValue) {
    //
    // }
  }
};
</script>

<!--<style scoped>-->
<style lang="scss" scoped></style>
